<template>
	<view>
		<quick-button></quick-button>
		<index v-if="tabbarValue === 0" />
		<message v-if="tabbarValue === 2" />
		<!-- <orderList ref="orderList" v-if="tabbarValue === 2"/> -->
		<my-order-list ref="myOrderList" :isInIndex="true" v-if="tabbarValue === 1" />
		<mine v-if="tabbarValue === 3" />

		<u-tabbar style="height: 60px" :value="tabbarValue" @change="onTabbarChange" :safeAreaInsetBottom="false">
			<u-tabbar-item text="护士上门">
				<image class="u-page__item__slot-icon" slot="inactive-icon" src="../static/home_icon.png"></image>
				<image class="u-page__item__slot-icon" slot="active-icon" src="../static/home_select_icon.png"></image>
			</u-tabbar-item>
<!-- 			<u-tabbar-item text="消息">
				<image class="u-page__item__slot-icon" slot="inactive-icon" src="../static/message_icon.png"></image>
				<image class="u-page__item__slot-icon" slot="active-icon" src="../static/message_select_icon.png">
				</image>
			</u-tabbar-item> -->
			<!-- 			<u-tabbar-item text="服务框">
				<image class="u-page__item__slot-icon" slot="inactive-icon" src="../static/server_icon.png">
				</image>
				<image class="u-page__item__slot-icon" slot="active-icon" src="../static/server_select_icon.png">
				</image>
			</u-tabbar-item> -->
			<u-tabbar-item text="订单">
				<image class="u-page__item__slot-icon" slot="inactive-icon" src="../static/server_icon.png"></image>
				<image class="u-page__item__slot-icon" slot="active-icon" src="../static/server_select_icon.png">
				</image>
			</u-tabbar-item>
<!-- 			<u-tabbar-item text="我的">
				<image class="u-page__item__slot-icon" slot="inactive-icon" src="../static/mine_icon.png"></image>
				<image class="u-page__item__slot-icon" slot="active-icon" src="../static/mine_select_icon.png"></image>
			</u-tabbar-item> -->
		</u-tabbar>
	</view>
</template>

<script>
import index from './index/index';
import message from './message/message';
// import orderList from './orderList/orderList';
import mine from './mine/mine';
import myOrderList from './myOrderList/myOrderList';
import * as loadFont from '../utils/loadFont.js';
export default {
	components: {
		index,
		message,
		// orderList,
		myOrderList,
		mine
	},
	data() {
		return {
			tabbarValue: 0,
			titles: ['护士上门', '消息', '订单', '我的']
		};
	},
	onLoad() {
		// #ifdef MP-WEIXIN
		//微信端加载字体
		// loadFont.loadCloudFont()
		// #endif
	},
	onPullDownRefresh() {
		this.refresh();
	},
	onReachBottom() {
		this.loadMore();
	},
	methods: {
		onTabbarChange(e) {
			this.tabbarValue = e;
			uni.setNavigationBarTitle({
				title: this.titles[e]
				
			});
		},
		refresh() {
			const index = {
				0: () => {
					uni.stopPullDownRefresh();
				},
				1: () => {
					uni.stopPullDownRefresh();
				},
				2: () => {
					this.$refs.myOrderList.refresh();
				},
				3: () => {
					uni.stopPullDownRefresh();
				}
			};
			index[this.tabbarValue]();
		},
		loadMore() {
			const index = {
				0: () => { },
				1: () => { },
				2: () => {
					this.$refs.myOrderList.loadMore();
				},
				3: () => { }
			};
			index[this.tabbarValue]();
		}
	}
};
</script>

<style lang="scss" scoped>
::v-deep.u-tabbar--fixed {
	height: 60px;
	display: flex;
	justify-content: center;
}
</style>
